new Vue({
 el:'#z_lunbo',
 data:{
   lunboList:[],
 },
 methods:{
   readFile(){
     this.$http.get('/moongoDB/animes').then(response =>{
       let res = response.body;
       if(res){
         let numArr = this.noRepeatNum(res.length-1,10);
         let lunboList = [];
         numArr.map(item=>{lunboList.push(res[item])});
         this.lunboList = lunboList;
         this.onLunBoMove();
       }
     },response=>{
       console.log('请求数据失败！');  
     });
   },

  // 不重复随机数组
  noRepeatNum(num, n) {
    if (typeof num !== "number" || typeof n !== "number") return false;  //对象检测
    var aNum = [];
    if (num <= n) {
      for (var j = 0; j < num; j++) {
        aNum.push(j);
      };
      return aNum;
    }         //如果n大于num就生成0到num-1的每一个数
    else {
      while (aNum.length < n) {
        var random = Math.round(Math.random() * num);
        if (aNum.indexOf(random) == -1) {
          aNum.push(random);
        }
      }
      return aNum;
    }
  },

  onLunBoMove(){
    /*轮播*/
   let img_L = 210;let lunbo_L;
   let max_L = 4 * img_L;
   let timer = setInterval(lunbo,5000);
   function lunbo(x) {
      let $lunbo = $(".lunbo");
      lunbo_L = $lunbo.position().left;
      
      if(x==-1){
          lunbo_L += img_L;
      }else{
          lunbo_L -= img_L;
      }

       if(lunbo_L>0){

       }
      else if(lunbo_L<=-max_L){
          $lunbo.stop().animate({
              left:0
          },300);

      }else{
          $lunbo.stop().animate({
              left:lunbo_L
          },250);
      }

   }
   let $z_lunbo = $("#z_lunbo");
   $z_lunbo.hover(function () {
       clearInterval(timer);
   }, function () {
       timer = setInterval(lunbo,5000);
   });

  /*轮播按钮*/
   let $left = $(".left");
   let $right = $(".right");

   $left.click(function () {
       clearInterval(timer);
       lunbo(-1);
   });

   $right.click(function () {
       clearInterval(timer);
       lunbo(1);
   });  
  },

  toAnimeInfo(id) {
    window.open(`/animeInfo?id=${id}`, '_blank')
  }

 },

 created(){
  this.readFile();
   $('.lunbo').html(`
   <a href="javascript:;" v-for="item in lunboList" @click="toAnimeInfo(item.id)">
    <li class="li">
      <div class="imgC">
        <img :src="item.imgSrc_F || ''" alt="">
      </div>
      <span>{{ item.title }}</span>
    </li>
  </a>`);  
  },
  mounted(){
    
  },
  updated(){ 
   
  }
});